/* 
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
var nbAddress=0;
$("#btnAddIpv4").on("click", function (){
    var div=$("#formsAddresses");
    nbAddress++;
    $("#nbAddress").val(nbAddress);
    
    //Cpt address
    var cptAddress = '<div class="addressIpv4'+nbAddress+' addressIp" style="padding-top: 25px;"><div class="form-group">\n\
        <input name="ip'+nbAddress+'" type="hidden" value="4"/>\n\
        <label class="col-md-3"></label>\n\
        <div class="col-md-3"><span class="cptAddress">'+nbAddress+'</span>. Adresse IPv4</div>\n\
        <div class="col-md-2" style="text-align:right;"><button type="button" class="btn btn-primary btn-xs deleteAddress">Supprimer</button></div></div>';
    
    //Interface
    var interface = '<div class="form-group">\n\
        <label class="col-md-4 control-label" for="interface">Interface</label>\n\
        <div class="col-md-4">\n\
        <input type="text" id="interface" name="interface'+nbAddress+'" class="form-control input-md" value="" /></div></div></form>';
    
    //Address
    var address = '<div class="form-group">\n\
        <label class="col-md-4 control-label" for="adresse">Adresse</label>\n\
        <div class="col-md-4">\n\
        <input type="text" id="address" name="address'+nbAddress+'" class="form-control input-md" value="" /></div></div>';
    
    //Netmask
    var netmask = '<div class="form-group">\n\
        <label class="col-md-4 control-label" for="netmask">Masque réseau</label>\n\
        <div class="col-md-4">\n\
        <input type="text" id="netmask" name="netmask'+nbAddress+'" class="form-control input-md" value="" /></div></div>';
    
     //Adddress type
     var addressType = '<div class="form-group">\n\
        <label class="col-md-4 control-label" for="type_address">Type d\'adresse</label>\n\
        <div class="col-md-4">\n\
        <select id="type_address" name="type_address'+nbAddress+'" class="form-control input-md"><option value="privée">Privée</option><option value="publique">Publique</option></div></div></div>';
                            
    div.append(cptAddress+interface+address+netmask+addressType);
    if(nbAddress === 1) $("#infoFormAddress").css('display','none');
});

$("#btnAddIpv6").on("click", function (){
    var div=$("#formsAddresses");
    nbAddress++;
    $("#nbAddress").val(nbAddress);
    
    //TODO Probleme qui se ferme automatiquement
    //Cpt address
    var cptAddress = '<div class="addressIpv6'+nbAddress+' addressIp" style="padding-top: 25px;"><div class="form-group">\n\
        <input name="ip'+nbAddress+'" type="hidden" value="6"/><input name="id_address'+nbAddress+'" type="hidden" value=""/>\n\
        <label class="col-md-3"></label>\n\
        <div class="col-md-3"><span class="cptAddress">'+nbAddress+'</span>. Adresse IPv6</div>\n\
        <div class="col-md-2" style="text-align:right;"><button type="button" class="btn btn-primary btn-xs deleteAddress">Supprimer</button></div></div>';    
    
    //Interface
    var interface='<div class="form-group">\n\
        <label class="col-md-4 control-label" for="interface">Interface</label>\n\
        <div class="col-md-4">\n\
        <input type="text" id="interface" name="interface'+nbAddress+'" class="form-control input-md" value="" /></div></div></form>';
    
    //Address
    var address = '<div class="form-group">\n\
        <label class="col-md-4 control-label" for="adresse">Adresse</label>\n\
        <div class="col-md-4">\n\
        <input type="text" id="address" name="address'+nbAddress+'" class="form-control input-md" value="" /></div></div></div>';
    div.append(cptAddress+interface+address);
    
    $('#formsAddresses').children('span.cptAddress').each(function () {
        console.log("test");
    });
    
    if(nbAddress === 1) $("#infoFormAddress").css('display','none');
});

$("#formsAddresses").on("click",".deleteAddress", function() {
    $(this).parents("div.addressIp").remove();
    nbAddress--;
    if(nbAddress == 0) $("#infoFormAddress").css('display','block');
    
    var temp = 1;
    $('#formsAddresses').find('span.cptAddress').each(function () {
        $(this).html(temp);
        temp++;
    });
    //TODO changer id 
});


